
<div class="app">

  <!--head-start-->
  <div class="app-header navbar {{app.settings.navbarCollapseColor}} "  [ngClass]="{hiddenNavibar:!state}" [ngClass]="{showNavibar:state}" >
    <div class="collapse pos-rlt navbar-collapse box-shadow " >
      <div class="nav navbar-nav m-t block" style="float:left">
        <a style="width: 50px"   (click)="hideNaviBar()"><i class="glyphicon glyphicon-th-list icon"></i></a>
      </div>      
      <!-- nabar right -->
      <div class=" nav navbar-nav navbar-right block" style="width:150px;float:right;" >
      <ul class="nav navbar-nav navbar-right " (click)="isOpen=true" (mouseleave)="isOpen=false" >
        <li class="dropdown" [class.open]="isOpen" style="margin-left: -20px">
          <a class="dropdown-toggle clear" >
                <span class="thumb-sm avatar pull-right m-t-n-sm m-b-n-sm m-l-sm">
                  <img [src]="head_img" alt="..." class="head-img">

                  <i class="on md b-white bottom"></i>
                </span>
            <span >{{username}}</span> <b class="caret"></b>
          </a>
          <!-- dropdown -->
          <ul class="dropdown-menu animated fadeInRight w" style="width: 9.5em;min-width:7em">
            <li>
              <a>用户信息</a>
            </li>
            <li class="divider"></li>
            <li>
              <a  (click)="logout()">登出</a>
            </li>
          </ul>
          <!-- / dropdown -->
        </li>
      </ul>
      </div>
      <!-- / navbar right -->

    </div>
    <!-- / navbar collapse -->
    <!--     <script type="text/javascript" src="js/controllers/signin.js"></script> -->
  </div>
  <!--head-end-->

  <!--nav-start-->
  <div class="app-aside hidden-xs  {{app.settings.asideColor}}" *ngIf="state" style=" margin-top:-50px;" >
    <div class="aside-wrap">
      <div class="navi-wrap">
        <!-- user -->
        <div class="clearfix hidden-xs text-center " >
          <div class="dropdown wrapper-xs">
            <!--<a>
            <span >
              <img src="assets/img/shared.png" style="height: 100px;width: 100px" class="img-full m-t" alt="logo图片损坏">
            </span>
            </a>-->
            <a>
            <span class="clear">
              <span class="block m-t-xs wood-cabinets">
                <strong class="font-bold text-2x">麻将吧</strong>

              </span>
              <!-- <span class="text-muted text-xs block">DANATH.CN</span> -->
            </span>
            </a>
          </div>
          <div class="line1 dk hidden-folded"></div>
        </div>
        <!-- list -->
        <div class="navi clearfix ng-scope">
          <ul class="nav">

           <span *ngFor="let menu of menus['children'];let idx = index">
             <li [class.active] = menu.active *ngIf="menu.index">
               <a (click)="selectMenu(idx)" [routerLink]="[menu.path]">
                 <i class="{{menu.cls}}"></i>
                 <span class="font-bold">{{menu.title}}</span>
               </a>
             </li>
              <li [class.active] = menu.active *ngIf="!menu.index">
                <a (click)="selectMenu(idx)"  class="auto">
                  <span class="pull-right text-muted">
                    <i class="fa fa-fw fa-angle-right text"></i>
                    <i class="fa fa-fw fa-angle-down text-active"></i>
                  </span>
                  <i class="{{menu.cls}}"></i>
                  <span>{{menu.title}}</span>
                </a>
                <ul class="nav nav-sub dk">
                  <li class="nav-sub-header">
                    <a>
                      <span>{{menu.title}}</span>
                    </a>
                  </li>

                  <li *ngFor="let func of menu['children']">
                    <a [routerLink]="[menu.path+'/'+func.path]">
                      <span>{{func.title}}</span>
                    </a>
                  </li>

                </ul>
              </li>

           </span>




          </ul>
        </div>
        <!-- / list -->

      </div>
    </div>
  </div>
  <!--nav-end-->

  <!-- content -->
  <div class="app-content" [ngClass]="{hiddenNavibar:!state}" [ngClass]="{showNavibar:state}">
    <div class="app-content-body">
      <router-outlet></router-outlet>
    </div>
  </div>
  <!-- /content -->

  <!--foot-start-->
  <div class="app-footer wrapper bg-dark" >
    <span class="pull-right">Shared-Cabinets<a class="m-l-sm text-muted" #watchthis><i class="fa fa-long-arrow-up" ></i></a></span>
    &copy; 2017 Copyright.
  </div>  
  <!--foot-end-->
  <div class='scrolltop'>
    <div class='scroll icon' id="top" ><i class="fa fa-4x fa-angle-up"></i></div>
  </div>

<!--   <go-top-button [html]="'<i class=\'fa fa-arrow-up\'></i>'"
                 [animate]="true"
                 [speed]="50"
                 [acceleration]="2"
                 [scrollDistance]="300"
                 [styles]="{
                    'border-radius': '20px 20px 20px 20px',
                    'right': '5px',
                    'color': 'green',
                    'border': '5px solid',
                    'line-height': '20px'
                 }">
  </go-top-button> -->


</div>


